<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>

    <meta charset="utf-8"/>
    <title>Web configurator Feature Assembly Models</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta name="description" content="Multi-staged web configurator for Feature Assembly Models"/>
    <meta name="author" content="Jasmien"/>

    <!-- Le styles -->
    <link href="../../resources/css/bootstrap.css"
          th:href="@{/resources/css/bootstrap.min.css}"
          rel="stylesheet"/>
    <style>
        body {
        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
        }
    </style>
    <link href="../../resources/css/bootstrap-responsive.css"
          th:href="@{/resources/css/bootstrap-responsive.min.css}"
          rel="stylesheet"/>

    <link rel="shortcut icon" href="../../resources/img/favicon.ico"/>
</head>

<body>

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="brand" href="#">Web configurator Feature Assembly Models</a>

            <div class="nav-collapse collapse">
                <ul class="nav">
                    <li class="active"><a href="home.html" th:href="@{/}">Home</a></li>
                   <!-- <li class="active"><a href="perspectives.html" th:href="@{/configurator}">Configurator</a></li> -->
                    <li><a href="about.html" th:href="@{/about}">About</a></li>
                    <li><a href="contact.html" th:href="@{/contact}">Contact</a></li>
                </ul>
            </div>
            <!--/.nav-collapse -->
        </div>
    </div>
</div>


<div class="container">

    <h1>Web Configurator for Feature Assembly Models</h1>

    <p/>
    <p>Debug</p>

    <ul>

        <li th:each="per : ${manager.perspectives}">
            <a href="#" th:href="@{'/' +${per.id}}" th:text="${per.id}">Perspective id</a>
            <ul>
                <li th:each="ft : ${per.features}" th:text="${ft.id}">
                    Feature id
                </li>
            </ul>
        </li>
    </ul>

</div>
<!-- /container -->

<!-- FOOTER -->
<hr/>
<footer>
    <p>
        <strong>&copy; 2013
            <a href="#">Jasmien De Ridder
            </a>, All Rights Reserved &reg;
        </strong>
    </p>
</footer>
<!-- /FOOTER -->

<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="../../resources/js/jquery-2.0.2.min.js"
        th:href="@{/resources/js/jquery-2.0.2.min.js}"></script>
<script src="../../resources/js/bootstrap.min.js"
        th:href="@{/resources/js/bootstrap.min.js}"></script>


</body>
</html>
